<template>
	<!-- 学校整改-待复查页面 -->
	<view class="record-container">
		<view class="" style="z-index: 1000; position: fixed; top: 0; left: 0; right: 0;">
			<view class="" v-show="targets.length>1"
				style="display: flex; justify-content: center; align-items: center; height: 30px; background-color: #F2F2F0;">
				<text>左右滑动切换不同指标页面</text>
			</view>
			<view class=""
				style="display: flex; justify-content: center; align-items: center; background-color: #fff; height: 35px;">
				<text
					style="margin-left: 5px; display: inline-block; display: flex; justify-content: center; align-items: center; height: 30px; width: 30px; border-radius: 50%;"
					v-for=" (item,index1) in targets.length" :key="index1"
					:style="index1 === index ? 'background-color: #3288DF;': 'background-color: #CCCCCC;'">
					{{index1+1}}</text>
			</view>
		</view>
		<view class="" style="background-color: #fff;" :style="{height: (targets.length> 1? '60px': '30px') }">

		</view>
		<swiper class="swiper" :indicator-dots="false" :autoplay="false" duration="500">
			<swiper-item v-for="(target,index) in targets" :key="target.id">
				<wyb-slide-listener @slideLeft="onSlide" @slideRight="onSlide">
					<!-- 此处放你要监听的内容 -->
					<uni-forms :ref="'targetForm'+index" :modelValue="target" label-position="top">
						<uni-forms-item label="指标名称" name="name">
							<uni-easyinput v-model="target.name" disabled />
						</uni-forms-item>
						<uni-forms-item label="活动时间" name="createTime">
							<uni-easyinput v-model="target.createTime" disabled />
						</uni-forms-item>
						<uni-forms-item label="指标说明" name="content">
							<uni-easyinput type="textarea" disabled v-model="target.content" />
						</uni-forms-item>

						<uni-forms-item label="评价结果" name="result">
							<uni-easyinput type="textarea" v-model="'问题:'+target.firstComment.content" disabled />
						</uni-forms-item>
						<uni-forms-item label="审核评价" name="remark">
							<uni-list>
								<uni-list-item v-for="(item, index2) in target.commentRemark" :key="index2"
									:title="item.content">
									<template v-slot:body>
										<text class="slot-box slot-text">{{item.content}}</text>
									</template>
									<template v-slot:footer>
										<image class="slot-image" :src="getSrc(item.state)" mode="widthFix"
											style="height: 25px;width: 25px;margin-left: auto;"></image>
									</template>
								</uni-list-item>
							</uni-list>
						</uni-forms-item>
					</uni-forms>
				</wyb-slide-listener>

			</swiper-item>
		</swiper>
		<view class="media">
			<u-cell-group>
				<u-cell isLink icon="file-text-fill" title="实证资料" @click="viewFile">
					<u-badge slot="value" :showZero="true" :value="fileNum"></u-badge>
				</u-cell>
			</u-cell-group>
		</view>
	</view>
</template>

<script>
	import storage from '@/utils/storage'
	import wybSlideListener from '@/components/wyb-slide-listener/wyb-slide-listener.vue'
	import {
		schoolTarget
	} from '@/api/school/index.js'
	import {
		isNotNull
	} from "@/utils/common.js"
	export default {
		data() {
			return {
				resultOption: [{
					text: '合格',
					value: 1
				}, {
					text: '不合格',
					value: 2
				}],
				activityId: "",
				// 活动指标id
				targetId: "",
				schoolId: "",
				comments: [],
				targets: [],
				index: 0,
				fileNum: 0
			}
		},
		methods: {
			onSlide: function(e) {
				let type = e.type
				switch (type) {
					case 'slideLeft':
						if (this.index < this.targets.length - 1) {
							this.index++;
							this.getFileNum();
						}
						break
					case 'slideRight':
						if (this.index > 0) {
							this.index--;
							this.getFileNum();
						}
						break
				}
			},
			getSchoolTarget(id) {

				schoolTarget(id).then(res => {
					console.log(res)
					let targets = res.targets
					let comments = res.comments
					let firstComments = res.firstComments
					for (let i = 0; i < targets.length; i++) {

						for (let j = 0; j < comments.length; j++) {

							if (comments[j].targetId == targets[i].id) {
								targets[i].commentRemark = comments[j].commentRemark
								targets[i].createTime = comments[j].createTime
								targets[i].improveState = comments[j].improveState
								targets[i].result = this.getResult(comments[j])
							}

						}

					}

					for (let k = 0; k < firstComments.length; k++) {
						targets[k].firstComment = firstComments[k]
					}
					this.targets = targets;
					this.comments = comments;
					// let targetImproveState = uni.getStorageSync("targetImproveState");

					// if ((targetImproveState == 0) || (targetImproveState == 2)) {
					// 	this.changeNaBtnTitle("提交")
					// } else {
					// 	this.changeNaBtnTitle("提交了")
					// }
					this.comments.forEach(item => {
						item["imgUrls"] = isNotNull(item.imgUrl) ? item.imgUrl.split(",") : [];
						item["voiceUrls"] = isNotNull(item.voiceUrl) ? item.voiceUrl.split(",") : [];
						item["videoUrls"] = isNotNull(item.videoUrl) ? item.videoUrl.split(",") : [];
					})
					this.getFileNum()
					console.log(targets)

				})
			},
			changeNaBtnTitle(text) {
				var pages = getCurrentPages();
				var page = pages[pages.length - 1];
				var currentWebview = page.$getAppWebview();
				var tn = currentWebview.getStyle().titleNView;

				if (text == "提交了") {
					tn.buttons[0].width = 0;
					currentWebview.setStyle({
						titleNView: tn
					});
				} else {
					tn.buttons[0].text = text;
					currentWebview.setStyle({
						titleNView: tn
					});
				}
			},
			getResult(value) {

				let result = "";

				if (value.improveState == 2) {
					result = "不合格";
				} else if (value.improveState == 1) {
					result = "合格";
				}

				if (value.light != null) {
					result = result + "\n亮点：" + value.light
				}

				if (value.content != null) {
					result = result + "\n问题：" + value.content
				}

				return result;

			},
			getSrc(state) {
				if (state == 1) {
					return "/static/images/icon_du_lv.png";
				} else {
					return "/static/images/icon_school_lv.png";
				}
			},
			viewFile() {
				if (this.fileNum == 0) {
					this.$u.toast("暂无实证资料");
					return;
				}
				const comment = this.comments[this.index];
				const fileUrls = {
					imgUrls: comment.imgUrls,
					voiceUrls: comment.voiceUrls,
					videoUrls: comment.videoUrls,
				}
				this.$tab.navigateTo("/pages/empirical-file/empirical-file?fileUrls=" + encodeURIComponent(JSON
					.stringify(fileUrls)));
			},
			getFileNum() {
				let num = 0;
				const comment = this.comments[this.index]
				num += comment.imgUrls.length;
				num += comment.voiceUrls.length;
				num += comment.videoUrls.length;
				this.fileNum = num;
			}

		},
		onLoad: function(option) {
			uni.setNavigationBarTitle({
				title: option.targetName
			});
			this.getSchoolTarget(option.id);
		},
		onNavigationBarButtonTap(e) {

			// 点击导航栏自定义按钮
			this.submit()
		}
	}
</script>

<style lang="scss" scoped>
	.record-container {
		font-size: 20px;

		.swiper {
			width: 100vw;
			min-height: 150vh;
		}



		.title-box {}

		.title-height {
			height: 7vh;
			line-height: 7vh;
			background-color: #F2F2F0;
		}

		.content {
			min-height: 7vh;
			background-color: #fff;
			// padding: 0 12px;
		}

		.pl-12 {
			padding-left: 12px;

		}

		.radio {
			padding-left: 10px;
		}

		.media {
			position: fixed;
			left: 0;
			right: 0;
			bottom: 25px;
			display: flex;

			.media-btn {
				width: 25vw;
			}
		}

	}

	.media {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		height: 3vh;
		display: flex;
		background-color: #fff;
	}

	/deep/ .is-disabled {
		background-color: #ffffff !important;
		color: #0d0d0d !important;
	}
</style>